<template>
	<view class="small-container">
		<view class="small-title">
			{{content}}
		</view>
		<view class="small-state" v-if="state!=null&&state!=''">
			<text>{{state}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			content: {
				type: String,
				default: ''
			},
			state:String
		},
	}
</script>

<style>
	.small-container{
		overflow: hidden;
		position: relative;
	}
	.small-title {
		color: #555555;
		margin: 24rpx 0 24rpx 50rpx;
	}
	.small-state{
		color: #555555;
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		height: 32rpx;
		line-height: 32rpx;
		margin: auto;
		background-color: #ff6970;
		border-radius: 12rpx;
		color: #FFFFFF;
		font-size: 24rpx;
		padding: 4rpx;
		margin-right: 50rpx;
		text-align: center;
	}
</style>
